<template>
  <div>
    公司
    <h3>{{ xxx }}</h3>
  </div>
</template>
<script>
export default {
  data () {
    return {
      xxx: 123,
      a: 10
    }
  },
  beforeCreate () {
    window.console.log('company:beforeCreate')
    // 创建前,实例化还没有完成,还不可以访问data与methods
  },
  created () {
    window.console.log('company:created')
    // 创建后,实例化已完成,可以访问data与methods,但是还不能访问vue渲染后的dom
  },
  beforeMount () {
    window.console.log('company:beforeMount')
    // 渲染前,只是读取了需要渲染部分的dom,但是还没有渲染,还不能访问vue渲染后的dom
  },
  mounted () {
    window.console.log('company:mounted')
    // 渲染后,已完成渲染,可以访问vue渲染后的dom
  },
  beforeUpdate () {
    window.console.log('company:beforeUpdate')
    // 更新前,vue页面上使用的相关数据已修改,但是还没有完成相关渲染
  },
  updated () {
    window.console.log('company:updated')
    // 更新后,vue页面上使用的相关数据已修改且已完成相关渲染
  },
  beforeDestroy () {
    window.console.log('company:beforeDestroy')
    // 销毁前,主体用于善后工作,这时候可以访问任何东西
  },
  destroyed () {
    window.console.log('company:destroyed')
    // 销毁前,还是可以访问data与methods,中止了html与js联系(中止渲染)
  }
}
</script>
<style></style>
